<template>
  <div>
    Home
    <button @click="btn">点击</button>
    <router-link to="/home/3/children">Chisdfl</router-link>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  props: ["i"],
  mounted() {
    // console.log(this.$route.params.i);
    console.log(this.i);
  },
  methods: {
    btn() {
      this.$router.push({ name: "Main" });
    }
  },
  beforeRouteEnter(to, from, next) {
      console.log(to);
      console.log(from);
      next()
      
    // 在渲染该组件的对应路由被 confirm 前调用
    // 不！能！获取组件实例 `this`
    // 因为当守卫执行前，组件实例还没被创建
  },
  beforeRouteUpdate(to, from, next) {
      console.log(to);
      console.log(from);
    console.log('我被复用了');
    next()
  },
  beforeRouteLeave(to, from, next) {
      console.log(to);
      console.log(from);
      next()
      console.log('离开Home');
      
    // 导航离开该组件的对应路由时调用
    // 可以访问组件实例 `this`
  }
};
</script>

<style scoped>
</style>